<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>信息</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="./layui/css/layui.css">
    <link rel="stylesheet" href="./css/main.css">
    <script src="./js/web-util.js"></script>
    <style>
        .coloum-title {
            font-weight: bold;
            text-align: right;
        }
    </style>
</head>
<body>
<div class="demoTable">
    <div class="layui-form" lay-filter="component-form-group">
        <div class="layui-form-item">

            <div class="layui-inline">
                <label class="layui-form-label">时间：</label>
                <div class="layui-input-inline">
                    <select name="gender_requirements">
                        <option value="2022">2022</option>
                    </select>
                </div>
            </div>

            <div class="layui-inline">
                <label class="layui-form-label">地区：</label>
                <div class="layui-input-inline">
                    <select id="work_site" name="work_site">
                        <option value="">所有：</option>
                        <option value="济南">济南</option>
                        <option value="青岛">青岛</option>
                        <option value="淄博">淄博</option>
                        <option value="临沂">临沂</option>
                        <option value="潍坊">潍坊</option>
                        <option value="泰安">泰安</option>
                        <option value="济宁">济宁</option>
                        <option value="枣庄">枣庄</option>
                        <option value="日照">日照</option>
                        <option value="聊城">聊城</option>
                        <option value="德州">德州</option>
                        <option value="菏泽">菏泽</option>
                        <option value="滨州">滨州</option>
                        <option value="威海">威海</option>
                        <option value="烟台">烟台</option>
                        <option value="东营">东营</option>
                    </select>
                </div>
            </div>

            <div class="layui-inline">
                <label class="layui-form-label">性别：</label>
                <div class="layui-input-inline">
                    <select name="gender_requirements">
                        <option value="">不限：</option>
                        <option value="男">男</option>
                        <option value="女">女</option>
                    </select>
                </div>
            </div>

            <div class="layui-inline">
                <label class="layui-form-label">学历：</label>
                <div class="layui-input-inline">
                    <select name="educational_requirements">
                        <option value="">不限</option>
                        <option value="研究生">研究生</option>
                        <option value="大学本科以上">大学本科以上</option>
                        <option value="大学专科以上">大学专科以上</option>
                    </select>
                </div>
            </div>

            <div class="layui-inline">
                <label class="layui-form-label">政治面貌：</label>
                <div class="layui-input-inline">
                    <select name="political_outlook">
                        <option value="">不限</option>
                        <option value="中共党员">中共党员</option>
                        <option value="中共党员或共青团员">中共党员或共青团员</option>
                    </select>
                </div>
            </div>

            <div class="layui-inline">
                <label class="layui-form-label">专业：</label>
                <div class="layui-input-inline">
                    <input id="major" type="text" name="major" autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-inline">
                <label class="layui-form-label">职位代码：</label>
                <div class="layui-input-inline">
                    <input id="position_code" type="text" name="position_code" autocomplete="off"
                           class="layui-input">
                </div>
            </div>

            <div class="layui-inline">
                <button id="search" data-type="reload" class="layui-btn layuiadmin-btn-order">
                    <!--lay-filter="LAY-app-order-search"-->
                    <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                </button>
            </div>

            <div class="layui-font-red">注：仅返回前300行数据。 右侧按钮提供导出表格功能</div>

        </div>
    </div>
</div>
<table class="layui-hide" id="test" lay-filter="test"></table>

<script src="layui/layui.js"></script>
<script>
    //JavaScript代码区域
    layui.use(['form', 'jquery', 'table'], function () {
        var form = layui.form
            , $ = layui.$;
        var table = layui.table;

        var request_param = {}

        form.on('select', function (data) {
            var name = data.elem.getAttribute("name")
            var value = data.value
            request_param[name] = value
        });


        table.render({
            elem: '#test'
            , id: 'servant'
            , url: './temp/empty.json'
            // ,method: 'post'
            , toolbar: true
            , parseData: resp_conversion
            //, cellMinWidth: 50 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            , cols: [[
                {field: 'office', title: '招录机关'}
                , {field: 'employer', title: '用人单位'}
                , {field: 'position_code', title: '职位代码'}
                , {field: 'job_title', title: '职位名称'}
                , {field: 'written_test_category', title: '公共科目笔试类别', hide: true}
                , {field: 'job_profile', title: '职位简介', hide: true}
                , {field: 'employment_plan', title: '录用计划', hide: true}
                , {field: 'recruitment_object', title: '招录对象'}
                , {field: 'educational_requirements', title: '学历要求', width: 90, sort: true}
                , {field: 'degree_requirements', title: '学位要求', hide: true}
                , {field: 'college_requirements', title: '大学专科专业要求', hide: true}
                , {field: 'undergraduate_requirements', title: '大学本科专业要求', hide: true}
                , {field: 'graduate_requirements', title: '研究生专业要求', hide: true}
                , {field: 'gender_requirements', title: '性别要求', width: 90, sort: true}
                , {field: 'registered_requirements', title: '户籍或生源地要求', hide: true}
                , {field: 'political_outlook', title: '政治面貌', width: 90, sort: true}
                , {field: 'work_years', title: '工作年限', width: 90}
                , {field: 'position_category', title: '职位类别', hide: true}
                , {field: 'professional_examination', title: '是否组织专业科目考试', hide: true}
                , {field: 'variance_investigation', title: '是否在面试阶段组织专业能力测试', hide: true}
                , {field: 'physical_examination', title: '是否差额考察', hide: true}
                , {field: 'work_site', title: '是否执行特殊体检标准', hide: true}
                , {field: 'remark', title: '工作地点', hide: true}
                , {field: 'website', title: '备注', hide: true}
                , {field: 'phone', title: '单位信息发布网站', hide: true}
                , {field: 'filename', title: '咨询电话', hide: true}
            ]]
            // , where: {
            //     key: {
            //         fileName: document.getElementById("filename").value
            //     }
            // }
        });

        var $ = layui.$, active = {
            reload: function () {
                request_param['major'] = document.getElementById("major").value;
                request_param['position_code'] = document.getElementById("position_code").value;
                //执行重载
                table.reload('servant', {
                    // page: {
                    //     curr: 1 //重新从第 1 页开始
                    // }
                    url: 'http://servant.7qibao.com/api/'
                    //url: 'http://127.0.0.1:8000/api/'
                    , where: request_param
                });
            }
        };

//        table.on('row(test)', function (obj) {
//            layer.open({
//                type: 2,
//                title: '职位详情',
//                closeBtn: 0,
//                area: ['70%', '70%'],
//                shadeClose: true,
//                skin: 'yourClass',
//                content: 'servantInfo.html',
//                success: function (layero, index) {    //成功获得加载servantInfo.html时，预先加载，将值从父窗口传到 子窗口
//                    sessionStorage.clear()
//                    sessionStorage.setItem('data', JSON.stringify(obj.data));
//                    let body = layer.getChildFrame('body', index);
//                    body.find("#data").val(obj.data);//意思是将rowselect[0].path这个值传递到子窗口的class="filepath"这个的文本框中，（预先加载）
//                    layui.form.render();
//                },
//            });
//
//            //标注选中样式
//            obj.tr.addClass('test').siblings().removeClass('layui-table-click');
//        });


        $('#search').on('click', function () {
            const type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });


</script>
</body>
</html>